import Taro from '@tarojs/taro'
import { Component, useEffect, useState } from 'react'

import { UserRole } from './types/user';
import { AppProvider, useAppContext } from './contexts/AppContext'
import { appStartCheckUserInfo, getInitDataStore } from './contexts/store'

// 全局样式
import './app.scss'
import 'taro-icons/scss/MaterialIcons.scss'


// 创建一个包装组件来在类组件中使用 hooks
const TokenCheckWrapper = () => {
  const { userInfo, setUserInfo, carLicenseList, setCarLicenseList } = useAppContext();
  const [isRedirecting, setIsRedirecting] = useState(false);
  
  // 检查token状态
  const checkTokenStatus = async () => {
    try {
      await appStartCheckUserInfo(userInfo, setUserInfo);
    } catch (e) {
      console.log('驾照易考通小程序启动检查错误', e);
    }
  };

  const getInitData = async () => {
    if(carLicenseList && Object.keys(carLicenseList).length > 0) {
      return;
    }
    await getInitDataStore(setCarLicenseList);
  }

  // 教练权限路由拦截
  useEffect(() => {
    // 在组件挂载时检查token和初始化数据
    checkTokenStatus();
    getInitData();
  }, []);

  // 监听用户信息变化，设置路由拦截
  useEffect(() => {
    // 定义教练可以访问的页面列表
    const coachAllowPages = [
      '/pages/coach-center/index',
      '/pages/member-pay/index',
    ];

    // 确保用户信息已加载且是教练角色
    if (userInfo && userInfo.role === UserRole.COACH && !isRedirecting) { // 20 是教练角色
      console.log('当前用户是教练角色:', userInfo);
      const currentPages = Taro.getCurrentPages();
      if (currentPages.length > 0) {
        const currentPage = currentPages[currentPages.length - 1];
        const currentRoute = currentPage.route ? '/' + currentPage.route : '';
        const isAllowPage = coachAllowPages.some(page => currentRoute.startsWith(page));
        
        // 如果当前页面不在允许列表中，重定向到教练中心
        if (!isAllowPage && currentRoute !== '/pages/coach-center/index') {
          setIsRedirecting(true);
          Taro.redirectTo({
            url: '/pages/coach-center/index',
            success: () => {
              setIsRedirecting(false);
            },
            fail: () => {
              setIsRedirecting(false);
            },
            complete: () => {
              setIsRedirecting(false);
            }
          });
        }
      }
    }
  }, [userInfo, isRedirecting]);

  return null;
};

class App extends Component {
  // 可以使用所有的 React 生命周期方法
  componentDidMount() {
    console.log('驾照易考通小程序挂载');
  }

  render() {
    // 在入口组件使用 AppProvider 包裹所有页面，提供全局状态管理
    return (
      <AppProvider>
        {/* Token检查包装组件 */}
        <TokenCheckWrapper />
        {this.props.children}
      </AppProvider>
    )
  }
}

// Taro应用生命周期钩子
(App as any).config = {
  onShow: function() {
    console.log('驾照易考通小程序显示');
  },
  onHide: function() {
    console.log('驾照易考通小程序隐藏');
  },
  onLaunch: function() {
    console.log('驾照易考通小程序启动');
  },
  onError: function(err) {
    console.log('小程序错误', err);
  },
  onPageNotFound: function(res) {
    console.log('页面不存在', res);
    Taro.redirectTo({
      url: '/pages/not-found/index'
    });
  }
};

export default App
